<template>
	<el-dialog v-model="visible" :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false">
		<el-form ref="dataFormRef" :model="dataForm" :rules="dataRules" label-width="120px" @keyup.enter="submitHandle()">
			<el-form-item label="作者" prop="author">
				<el-input v-model="dataForm.author" placeholder="作者"></el-input>
			</el-form-item>
      <el-form-item label="项目包名" prop="packageName">
				<el-input v-model="dataForm.packageName" placeholder="项目包名"></el-input>
			</el-form-item>
      <el-form-item label="模块名称" prop="moduleName">
				<el-input v-model="dataForm.moduleName" placeholder="模块名称"></el-input>
			</el-form-item>
      <el-form-item label="基类" prop="baseclassId">
        <el-select v-model="dataForm.baseclassId" placeholder="基类" style="width: 100%" clearable>
          <el-option v-for="item in baseClassList" :key="item.id" :label="item.code" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
			<el-form-item prop="templateVersion" label="模板版本" >
				<el-select v-model="dataForm.templateVersion" clearable placeholder="模板版本" style="width: 100%" @change="getChangeVersion">
          <el-option v-for="(item,index) in templateVersionList" :key="index" :value="item.id" :label="item.versionName"></el-option>
				</el-select>
			</el-form-item>

			<el-form-item label="后端生成路径" prop="backendPath">
				<el-input v-model="dataForm.backendPath" placeholder="后端生成路径"></el-input>
			</el-form-item>
			<el-form-item label="前端生成路径" prop="frontendPath">
				<el-input v-model="dataForm.frontendPath" placeholder="前端生成路径"></el-input>
			</el-form-item>
			<el-form-item label="默认生成结构" prop="templateSelect">
        <el-select v-model="dataForm.templateSelect" filterable  multiple placeholder="请选择默认生成结构" style="width: 100%">
          <el-option
              v-for="item in columnList"
              :key="item.id"
              :label="item.templateName"
              :value="item.id"
          >
            <span style="float: left">{{ item.templateName }}</span>
            <span  style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
              <el-tag effect="dark" type="success" > {{item.templateType}}</el-tag></span>
          </el-option>
        </el-select>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="visible = false">取消</el-button>
			<el-button type="primary" @click="submitHandle()">确定</el-button>
		</template>
	</el-dialog>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import { ElMessage } from 'element-plus/es'
import { projectConfigApi, projectConfigSubmitApi } from '@/api/projectConfig'
import { templateVersionListApi } from '@/api/templateVersion'
import { useBaseClassListApi } from '@/api/baseClass'
import {templateListApi} from '@/api/template'
import type { FormInstance, FormRules } from 'element-plus'

const emit = defineEmits(['refreshDataList'])

const visible = ref(false)
const dataFormRef = ref()
const baseClassList = ref<any[]>([])
const columnList = ref<any[]>([])
const templateVersionList= ref<any[]>([])
const ruleFormRef = ref<FormInstance>()
const dataForm = reactive({
	id: '',
	dbType: '',
	connName: '',
	connUrl: '',
	username: '',
	password: ''
})

const init = (projectId?: number) => {
  debugger
	visible.value = true
	dataForm.id = ''

	// 重置表单数据
	if (dataFormRef.value) {
		dataFormRef.value.resetFields()
	}

	// id 存在则为修改
	if (projectId) {
		getProjectConfig(projectId)
	}
  dataForm.sysProjectId = projectId
  getBaseClassList()
  getTemplateVersionList()
}

const getProjectConfig = async (projectId: number) => {
  const projectConfigRes = await projectConfigApi(projectId)
  if(projectConfigRes){
    Object.assign(dataForm, projectConfigRes.data)
    const templateVersion = await getChangeVersion(dataForm.templateVersion)
    dataForm.templateSelect = projectConfigRes.data.templateSelect
    if (dataForm.templateSelect != null) {
      dataForm.templateSelect = dataForm.templateSelect.split(",")
    }
  }
}

const getBaseClassList = () => {
  useBaseClassListApi().then(res => {
    baseClassList.value = res.data
  })
}

//模板集合
const getChangeVersion = (val) =>{
  const parm ={}
  if(val){
    parm.templateVersionId=val
    //重置选择默认结构
    dataForm.templateSelect=''
  }
  templateListApi(parm).then(res =>{
    columnList.value = res.data
  })
}
//模板版本
const getTemplateVersionList =() =>{
  templateVersionListApi({}).then(res =>{
    templateVersionList.value = res.data
  })
}

const dataRules = reactive<FormRules>({
  templateVersion: [
    {
      required: true,
      message: '请选择模板版本',
      trigger: 'change',
    },
  ],
  templateSelect: [
    {
      required: true,
      message: '请选择默认生成结构',
      trigger: 'change',
    },
  ],

})
// 表单提交
const submitHandle = () => {
	dataFormRef.value.validate((valid: boolean) => {
		if (!valid) {
			return false
		}
    dataForm.baseclassName = getBaseclassName(dataForm.baseclassId)
    if(dataForm.templateSelect!=null){
      dataForm.templateSelect = dataForm.templateSelect.join(",")
    }
    projectConfigSubmitApi(dataForm).then(() => {
			ElMessage.success({
				message: '操作成功',
				duration: 500,
				onClose: () => {
					visible.value = false
					emit('refreshDataList')
				}
			})
		})
	})
}
const getBaseclassName = (id:number) =>{
  const baseList = baseClassList.value.filter(baseClass => baseClass.id == id)
  if(baseList.length>0){
    return baseList[0].packageName
  }
  return ""
}
defineExpose({
	init
})
</script>
